<!DOCTYPE html>
<html lang="{{ locale }}">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    {% if noindex -%}
    <meta name="robots" content="noindex">
    {%- endif %}

    {# Dogfood document speculation rules origin trial #}
    <!-- developer.chrome.com origin trial token for speculation rules document rules -->
    <meta http-equiv="origin-trial" content="AtXwNtvKLGSNFBuawE0CYB2BnrKRyHz9s9KLZ9LkTTtvcxoK4UIgtNQrwGOD6wQCKsbHAsbYYjdkBdvj3vuk2QAAAABseyJvcmlnaW4iOiJodHRwczovL2RldmVsb3Blci5jaHJvbWUuY29tOjQ0MyIsImZlYXR1cmUiOiJTcGVjdWxhdGlvblJ1bGVzUHJlZmV0Y2hGdXR1cmUiLCJleHBpcnkiOjE3MDk2ODMxOTl9">

    {% include 'partials/meta.njk' %}
    {% block feed %}
      <link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ site.url }}/feeds/all.xml">
      <link rel="alternate" type="application/rss+xml" title="{{ site.title }} - {{ 'i18n.common.blog' | i18n(locale) }}" href="{{ site.url }}/feeds/blog.xml">
      <link rel="alternate" type="application/rss+xml" title="{{ site.title }} - {{ 'i18n.common.articles' | i18n(locale) }}" href="{{ site.url }}/feeds/articles.xml">
    {% endblock %}

    <link rel="preload" as="font" crossorigin href="/fonts/google-sans-v2003/regular/latin.woff2">
    <link rel="preload" as="font" crossorigin href="/fonts/google-sans-v2003/medium/latin.woff2">


    {% block css %}{% endblock %}

    <script type="module" src="{{ helpers.hashForProd('/js/main.js') }}"></script>
    {% if process.env.NODE_ENV === 'production' %}
      <script async src="https://www.googletagmanager.com/gtm.js?id=GTM-5QF3RT2"></script>
    {% endif %}

    {# Private Aggregation API testing script #}
    {# The test will run until mid-April #}
    {% if process.env.NODE_ENV === 'production' %}
      <script type="module" defer src="https://shared-storage-demo-content-producer.web.app/paa/scripts/private-aggregation-test.js"></script>
    {% endif %}

    {# Add a facility for pages to declare an array of script paths. #}
    {# Note: We could also use this approach to load module/nomodule scripts #}
    {# https://philipwalton.com/articles/deploying-es2015-code-in-production-today/ #}
    {% if pageScripts %}
      {% for item in pageScripts %}
        <script type="module" src="{{ helpers.hashForProd(item) }}"></script>
      {% endfor %}
    {% endif %}

    {# Exclude the /articles/ section as a control #}
    <script type="speculationrules">
    {
      "prerender": [
        {
          "source": "document",
          "where": {
            "and": [
              {"href_matches": "/*\\?*#*"},
              {"not": {"href_matches": "/articles/*\\?*#*"}}
            ]
          },
          "eagerness": "moderate"
        }
      ]
    }
    </script>

    {# This needs to be include'd, because it expands 11ty variables #}
    <script>{% include 'partials/script.js' %}</script>

    {# Some articles may have previously used lists with anchors for their
    content (like FAQs) which may have evolved into their own articles by now.
    Such anchors should be able to link to those new articles #}
    {% if anchorRedirects %}
    <script>
      (() => {
        let anchorRedirects = {{ anchorRedirects|dump|safe }};

        function redirect(targetURL) {
          let {hash} = new URL(targetURL);
          if (!hash) {
            return;
          }

          hash = hash.substring(1);

          if (anchorRedirects[hash]) {
            window.location.replace(anchorRedirects[hash]);
          }
        }
        redirect(window.location.href);
        window.addEventListener('hashchange', (event) => redirect(event.newURL));
      })();
    </script>
    {% endif %}

  </head>
  <body>
    <div class="scaffold">
      {% block header %}
        {% include 'partials/top-nav.njk' %}
      {% endblock %}

      {% block sidebar %}
        {% include 'partials/side-nav.njk' %}
      {% endblock %}

      <main tabindex="-1" id="main-content" data-side-nav-inert data-search-inert>
        {% include 'partials/banner.njk' %}
        {% block title_bar %}{% endblock %}
        {% block content %}{% endblock %}
      </main>

      {% block footer %}
        {% include 'partials/footer.njk' %}
      {% endblock %}
    </div>
    {% include 'partials/cookie-banner.njk' %}

    {% block scripts %}{% endblock %}
  </body>
</html>
